<template>
    <div>
        <ul class="list-info">
            <li>
                <my-input
                    v-bind:params="shopCodeProps"
                    :cb="shopCodeChange"
                ></my-input>
            </li>
            <li>
                <my-select
                    v-bind:params="discountProps"
                    :cb="discountChange"
                >
                </my-select>
            </li>
            <li>
                <my-select
                    v-bind:params="modeProps"
                    :cb="modeChange"
                >
                </my-select>
            </li>
            <li v-if="store.mode==='定时送餐'" @click="jumpTo('time_list')">
                <my-content
                    v-bind:params="sendTimeProps"
                ></my-content>
            </li>
            <li v-if="store.mode==='定时送餐'">
                <my-input
                    v-bind:params="feeProps"
                    :cb="feeChange"
                ></my-input>
            </li>
            <li @click="jumpTo('address_list')">
                <my-content
                    v-bind:params="sendAdressProps"
                ></my-content>
            </li>
            <li v-if="store.mode==='定时送餐'">
                <my-select
                    v-bind:params="aheadDayProps"
                    :cb="changeAheadDay"
                >
                </my-select>
            </li>
            <li @click="jumpTo('invoice')">
                <my-content
                    v-bind:params="invoiceProps"
                ></my-content>
            </li>  
            <li @click="jumpTo('address_list')">
                <my-content
                    v-bind:params="companyinfoProps"
                ></my-content>
            </li>
            <li @click="jumpTo('address_list')">
                <my-content
                    v-bind:params="employeeProps"
                ></my-content>
            </li>    
        </ul>

        <div class="btn-part">
            <div class="save-btn">
                提交
            </div>
        </div>
    </div>
</template>

<script>
    import Select from '@/components/Select'
    import Input from '@/components/Input'
    import Content from '@/components/Content'
    import Store from '@/store/Store.js'
    export default {
        data(){
            return{
                store: Store.TakeOutSettingStore,
                shopCodeProps:{
                    label:'店铺编号',
                    placeholder:'必填',
                    maxlength:'20'
                },
                discountProps:{
                    label:'折扣设置',
                    data:[]
                },
                modeProps:{
                    label:'送餐模式',
                    data:['与普通外卖一致', '定时送餐'],
                },
                feeProps:{
                    label:'配送费（元／单）',
                    placeholder:'必填',
                    maxlength:'3'
                },
                sendTimeProps:{
                    label:'送餐时间',
                    value:''
                },
                sendAdressProps:{
                    label:'可配送地址'
                },
                aheadDayProps:{
                    label:'提前点餐（天）',
                    data:[]
                },
                companyinfoProps:{
                    label:'企业详情',
                    companyId:''
                },
                employeeProps:{
                    label:'人员数量'
                }
            }
        },
        methods:{
            //初始化
            init(){
                //this.discountAry = [...Array(100).keys()];   
                this.discountProps['data'] = Array.from(Array(100),(v,k)=> k === 0 ?'无':`${k}折`) 
                this.aheadDayProps['data'] = Array.from(Array(7),(v,k)=> k === 0 ?'无':k) 
                this.sendTimeProps.value = Store.TakeOutSettingStore.sendMealTime.length;
            },
           discountChange(v){
               this.store.discount = v
               console.log(this.store.discount)
           },
           modeChange(v){
                this.store.mode = v
                console.log(this.store.mode)
           },
           shopCodeChange(v){
               this.store.shopCode = v
                console.log(this.store.shopCode)
           },
           feeChange(v){
               this.store.fee = v
               console.log(this.store.fee)
           },
           jumpTo(path){
               this.$router.push({path: path});
           },
           changeAheadDay(v){
               this.store.aheadDay = v
               console.log(this.store.aheadDay)
           }
        },
        created() {
            this.init();
        },
        computed:{
            invoiceProps:function(){
                let val = ''
                if(Store.TakeOutSettingStore.invoiceSwitch == false){
                    val ='不开'
                }else{
                    val = Store.TakeOutSettingStore.invoice
                }
                return {
                    label:'发票', 
                    value:val
                }
            }
        },
        components:{
            'my-input':Input,
            'my-select':Select,
            'my-content':Content
        }
    }
</script>

<style lang="less">
    .list-info{
        margin:10px;
        border-radius:4px;
        background:#fff;
        padding:0 15px;
        li{
            position:relative;
            border-bottom:1px #e6e6e6 solid;
            box-sizing: content-box;
            height:44px;
            &:last-child {
                border-bottom: none;
            }
        }       
    }
   
</style>